<link rel="stylesheet" type="text/css" href="<?php echo $this->baseUrl() ?>/public/css/input.css"/>
<form method="POST" enctype="multipart/form-data" autocomplete="off">
    <div id="input-content">
        <div class="input-step">
            <table class="timeline" width="100%" border="0" cellpadding="0" cellspacing="0">
                <tr>
                    <th scope="col">General infomation</th>
                    <th scope="col">Dunnage</th>
                    <th scope="col" class="current" >Tally</th>
                    <th scope="col">Cargo supervision</th>
                </tr>
            </table>
            <div class="step-content">
                <h1> TALLY OPERATIONS</h1>
                <div class="cleft">
                    <div class="item">
                        <label for="VAaps">Vessel arrived at p/s</label>
                        <div class="reselect">
                            <input type="text" name="vessel_arrived_at_ps" class="datetime" placeholder="Datetime"/>
                        </div>
                    </div>
                    <div class="item">
                        <label for="VAab">Vessel arrived at buoy.</label>
                        <div class="reselect">
                            <input type="text" name="vessel_arrived_at_buoy" class="datetime" placeholder="Datetime"/>
                        </div>
                    </div>
                    <div class="item">
                        <label for="ClD">Commenced dunnaging</label>
                        <div class="reselect">
                            <input type="text" name="commenced_dunnaging" class="datetime" placeholder="Datetime"/>
                        </div>
                    </div>
                    <div class="item">
                        <label for="CmD">Completed dunnaging</label>
                        <div class="reselect">
                            <input type="text" name="completed_dunnaging" class="datetime" placeholder="Datetime"/>
                        </div>
                    </div>
                </div>
                <div class="cright">
                    <div class="item">
                        <label for="CmD">Cargo loaded on board</label>
                        <div class="reselect">
                            <input type="text" name="cargo_loaded_on_board"/>
                        </div>
                    </div>  
                    <div class="item">
                        <label for="CmD">Number of bags</label>
                        <div class="reselect">
                            <input type="text" name="number_of_bags"/>
                        </div>
                    </div>      
                    <div class="item">
                        <label for="CmD">Net weight</label>
                        <div class="reselect">
                            <input type="text" name="net_weight"/>
                        </div>
                    </div>          
                    <div class="item">
                        <label for="CmD">Gross weight</label>
                        <div class="reselect">
                            <input type="text" name="gross_weight"/>
                        </div>
                    </div>                      
                </div>
                <div style="clear: both;">&nbsp;</div>
                <h1 class="table">UPDATE TALLY OPERATIONS</h1>
                <div style="width:60%">
                    <div class="item">
                        <label for="VAaps">Total cargo loaded last 24hrs</label>
                        <div class="reselect">
                            <input type="text" name="total_cargo_loaded_last_24h">
                        </div>
                    </div>
                    <div class="item">
                        <label for="VAab">Total cargo loaded upto date</label>
                        <div class="reselect">
                            <input type="text" name="total_cargo_loaded_upto_date"/>
                        </div>
                    </div>
                    <div class="item">
                        <label for="ClD">Balance to load</label>
                        <div class="reselect">
                            <input type="text" name="balance_to_load"/>
                        </div>
                    </div>
                    <div class="item">
                        <label for="CmD">ETS</label>
                        <div class="reselect">
                            <input type="text" name="ets" class="datetime"/>
                        </div>
                    </div>        
                    <div class="item">
                        <label for="CmD">ATS</label>
                        <div class="reselect">
                            <input type="text" name="ats" class="datetime"/>
                        </div>
                    </div>                        
                </div>
                <h1 class="table">DOCUMENTS</h1>
                <div id="new-document">
                    <span id="mask-new-file"></span>
                    <div id="upload-progress" style="display:none"></div>                    
                </div>
                <div class="file-wrapper" style="padding-top:10px" id="wrap_upload_buttons">
                    <span class="button" id="add_file">Add Files</span>          
                </div>
                <div style="clear: both;">&nbsp;</div>
            </div>
            <div class="next"><input type="submit" class="next" value="SAVE &amp; CONTINUE" /></div>
        </div>
        <div style="clear: both;">&nbsp;</div>
    </div>
</form>

<script>
    var ref_no = '<?php echo $this->ref_no ?>';
</script>

<link rel='stylesheet' type='text/css' href='<?php echo $this->baseUrl() ?>/public/css/jquery-ui/jquery-ui-1.10.3.css'/>
<script src='<?php echo $this->baseUrl() ?>/public/js/jquery-ui-1.10.3.js'></script>
<script type="text/javascript" src="<?php echo $this->baseUrl() ?>/public/js/plupload/plupload.js"></script>
<script type="text/javascript" src="<?php echo $this->baseUrl() ?>/public/js/plupload/plupload.gears.js"></script>
<script type="text/javascript" src="<?php echo $this->baseUrl() ?>/public/js/plupload/plupload.silverlight.js"></script>
<script type="text/javascript" src="<?php echo $this->baseUrl() ?>/public/js/plupload/plupload.flash.js"></script>
<script type="text/javascript" src="<?php echo $this->baseUrl() ?>/public/js/plupload/plupload.browserplus.js"></script>
<script type="text/javascript" src="<?php echo $this->baseUrl() ?>/public/js/plupload/plupload.html4.js"></script>
<script type="text/javascript" src="<?php echo $this->baseUrl() ?>/public/js/plupload/plupload.html5.js"></script>
<script src='<?php echo $this->baseUrl() ?>/public/js/newservice.js'></script>
<script src='<?php echo $this->baseUrl() ?>/public/js/newtally.js'></script>

<style>
    .ui-progressbar {
        width: 200px;
        height: 10px;
    }
</style>

